<template>
  <div>
    <h2>侦听器</h2>
    <input type="text" v-model="uname">
  </div>
</template>

<script>
export default {
  data () {
    return {
      uname: '小鱼卷',
      cat: {
        name: 'kitty',
        age: 2
      }
    }
  },
  watch: {
    uname: {
      handler (val) {
        console.log(val)
      },
      immediate: true, //立即侦听

    },
    cat: {
      handler (val) {
        console.log(val)
      },
      deep: true,  //深度侦听
    }

    // 'cat.name' (val) {
    //   console.log(val)
    // }
  }
}
</script>

<style>

</style>